<template>
	<view class="" @click="$emit('click')">
		<view class="" v-if="size=='large'">
			<uv-button :custom-style="customStyle1" :type="type" :text="text" :loading="loading" ></uv-button>
		</view>
		<view class="" v-else-if="size=='large2'">
			<uv-button :custom-style="customStyle4" :type="type" :text="text" :loading="loading" plain></uv-button>
		</view>
		<view class="" v-else-if="size=='normal'">
			<uv-button :custom-style="customStyle2" :type="type" :text="text" :loading="loading" :plain="true"></uv-button>
		</view>
		<view class="" v-else-if="size=='mini'">
			<uv-button :custom-style="customStyle3" :type="type" :text="text" :loading="loading" ></uv-button>
		</view>
		<view class="" v-else>
			<uv-button :custom-style="customStyle" :type="type" :text="text" :loading="loading" ></uv-button>
		</view>
	</view>
</template>

<script>
	export default {
		name: "MyTabbar",
		props: {
			customStyle: {
				type: Object,
			},
			text: {
				type: String,
			},
			size: {
				type: String,
			},
			type: {
				type: String,
			},
			loading: {
				type: Boolean,
			},
		},
		data() {
			return {
				customStyle1: {
					width: '502rpx',
					height: '68rpx',
					borderRadius: '8rpx',
					fontSize: '30rpx',
					fontFamily: 'PingFang SC-Regular, PingFang SC',
					fontWeight: 400,
					color: '#FFFFFF',
					border: 0,
				},
				customStyle2: {
					width: '200rpx',
					height: '72rpx',
					borderRadius: '8rpx',
					fontSize: '30rpx',
					fontFamily: 'PingFang SC-Regular, PingFang SC',
					fontWeight: 400,
					color: '#FFFFFF',
					border: 0,
				},
				customStyle3: {
					width: '128rpx',
					height: '56rpx',
					borderRadius: '8rpx',
					fontSize: '26rpx',
					fontFamily: 'PingFang SC-Regular, PingFang SC',
					fontWeight: 400,
					color: '#FFFFFF',
					border: 0,
				},
				customStyle4: {
					width: '502rpx',
					height: '68rpx',
					borderRadius: '8rpx',
					fontSize: '30rpx',
					fontFamily: 'PingFang SC-Regular, PingFang SC',
					fontWeight: 400,
					background:'#fff',
				},
			}
		},

		mounted() {

		},
		methods: {

		},

	}
</script>

<style lang="scss" scoped>

</style>